<template>
	<view class="bto-box">
		<view class="nav-titles">
			<u-search placeholder="请输入车牌号" @custom="searchBtn" v-model="plateNumber"></u-search>
		</view>
		<u-toast ref="uToast"></u-toast>
		<view class="box-form" @click="toNextForm(item)" v-for="(item,index) in tableData" :key="index">
			<view class="titles">
				<text class="car-text">预约车辆：</text> {{item.plateNumber}}
			</view>
			<view class="bottom-font">
				<image class="left-img" src="../../static/xh.png" mode="aspectFit"></image>
				<view class="right-box">
					<view class="nav" v-if="item.driverPhone">
						<text class="label">联系方式：</text>
						{{item.driverPhone || '/'}}
					</view>
					<view class="nav">
						<text class="label">订单状态：</text>
						{{ item.statusName || '-'}}
					</view>
					<view class="nav">
						<text class="label">预约事项：</text>
						{{item.appointment.remark}}
					</view>
					<view class="nav">
						<text class="label">预约时间：</text>
						{{item.appointment.appointDate}}
					</view>
				</view>
			</view>
		</view>
		<u-empty v-if="tableData.length<1" text="暂无数据" icon="bookmark"></u-empty>
	</view>
</template>

<script>
	import {
		getLoadingOrderByPlateNumber,
		appointmentDock,
		callQueue,
		carIn,
		carWeightOne,
		confirmUnLoadStart,
		confirmUnLoadEnd,
		carWeightTwo,
		carOut
	} from '@/api/mobile/admin.js'
	import {
		listByType
	} from '../../api/mobile/dict.js'
	export default {
		data() {
			return {
				plateNumber: "苏M467894",
				tableData: [],
				show: false,
				dictList: []
			}
		},
		mounted() {
			this.getDict()
		},
		methods: {
			toRouter(item) {
				uni.navigateTo({
					url: item
				})
			},
			// 
			async getDict() {
				let res = await listByType('loading_status');
				console.log(res.data)
				this.dictList = res.data
			},
			async searchBtn() {

				const res = await getLoadingOrderByPlateNumber(this.plateNumber);
				this.$refs.uToast.show({
					type: "loading",
					title: "正在加载",
					message: "正在加载",
					iconUrl: "https://uviewui.com/demo/toast/loading.png",
					complete: (res1) => {
						console.log(res.data);
						if (Array.isArray(this.dictList) && this.dictList.length > 0) {
							const dictMap = new Map(this.dictList.map(item => [item.dictValue, item
								.dictLabel
							]));
							res.data.forEach(item => {
								item.statusName = dictMap.get(item.status) || item.status;
							});
						}

						this.tableData = res.data;

					}
				});
			},
			toNextForm(item) {
				this.toRouter('/setting/queue/detail')
				uni.setStorageSync('userOrder', item)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.bto-box {
		width: 100%;
		min-height: 100vh;
		// background-image: linear-gradient(to bottom, #f2cea5 0%, white 100%);
		padding-top: 54rpx;
		box-sizing: border-box;
		padding-left: 30rpx;
		padding-right: 30rpx;
		padding-bottom: 100rpx;

		.nav-titles {
			width: 100%;
			min-height: 80rpx;
			margin-bottom: 40rpx;

		}

		.box-form {
			width: 100%;
			min-height: 100rpx;
			border-radius: 30rpx;
			background: #fff;
			box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
			padding: 30rpx;
			box-sizing: border-box;
			margin-bottom: 20rpx;

			.titles {
				font-size: 28rpx;
				font-weight: 600;

				.car-text {
					font-size: 28rpx;
					font-weight: 400;
				}
			}

			.bottom-font {
				width: 100%;
				display: flex;
				justify-content: space-between;
				margin-top: 15rpx;
				align-items: center;

				.left-img {
					height: 80rpx;
					width: 100rpx;
				}

				.right-box {
					width: 500rpx;
					min-height: 100rpx;

					.nav {
						width: 100%;
						font-size: 26rpx;
						font-weight: 600;
						margin-bottom: 6rpx;

						.label {
							font-size: 26rpx;
							color: #776898;
							font-weight: 400;
						}
					}
				}
			}
		}
	}
</style>